<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>部门信息列表</title>
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.6.2/dist/css/bootstrap.min.css">
</head>
<body>
<div class="container mt-4">
    <h2>部门信息管理</h2>
    
    <!-- 添加按钮 -->
    <div class="mb-3">
        <a href="/departItem/addForm" class="btn btn-primary">添加新部门</a>
    </div>
    
    <!-- 部门列表表格 -->
    <table class="table table-striped">
        <thead>
        <tr>
            <th>部门ID</th>
            <th>部门名称</th>
            <th>操作</th>
        </tr>
        </thead>
        <tbody>
        <tr th:each="item : ${departItems}">
            <td th:text="${item.departID}"></td>
            <td th:text="${item.departName}"></td>
            <td>
                <a th:href="@{/departItem/get/{id}(id=${item.departID})}" class="btn btn-sm btn-info">查看</a>
                <a th:href="@{/departItem/editForm(id=${item.departID})}" class="btn btn-sm btn-warning">编辑</a>
                <form th:action="@{/departItem/delete/{id}(id=${item.departID})}" method="post" style="display: inline;">
                    <button type="submit" class="btn btn-sm btn-danger" 
                            onclick="return confirm('确定要删除这个部门吗？')">删除</button>
                </form>
            </td>
        </tr>
        </tbody>
    </table>
</div>

<script src="https://cdn.jsdelivr.net/npm/jquery@3.5.1/dist/jquery.slim.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@4.6.2/dist/js/bootstrap.bundle.min.js"></script>
</body>
</html>